<template>
	<div class="orderxq">
		<ul class="orderxq-footer" v-if="orderlist.status==20&&member_status==1">
			<li><router-link :to="{path:'/informationshi',query:{'goodsid':last_goodid}}"><span><img src="http://liangzhong.oss-cn-hangzhou.aliyuncs.com/newwap/shangpin/icon_kefu@2x.png"/></span><span>在线客服</span></router-link></li>
			<li><a href="tel:057189173797"><span><img src="http://liangzhong.oss-cn-hangzhou.aliyuncs.com/newwap/shangpin/icon_pingtai@2x.png"/></span><span>联系平台</span></a></li>
		</ul>
		<ul class="orderxq-footer" v-if="member_status==20">
			<li><router-link :to="{path:'/informationshi',query:{'goodsid':last_goodid}}"><span><img src="http://liangzhong.oss-cn-hangzhou.aliyuncs.com/newwap/shangpin/icon_kefu1@2x.png"/></span><span>联系买家</span></router-link></li>
			<li><a href="tel:057189173797"><span><img src="http://liangzhong.oss-cn-hangzhou.aliyuncs.com/newwap/shangpin/icon_pingtai@2x.png"/></span><span>联系平台</span></a></li>
		</ul>
		<div class="shopDd-footer-heji order-footer-pay" v-if="orderlist.status==11&&member_status==1">
			<span>合计：</span>
			<span>￥</span>
			<span>{{orderlist.order_amount_detail[0]}}.</span>
			<span>{{orderlist.order_amount_detail[1]}}</span>
			<span @click="orderpay()">去支付</span>
		</div>
		<div class="shopDd-footer-heji order-footer-paydj" v-if="orderlist.advance_status!=0&&0<Number(orderlist.ad_status)<3&&orderlist.status=='11'&&member_status==1">
			<span>合计：</span>
			<span>￥</span>
			<span>{{orderlist.order_amount_detail[0]}}.</span>
			<span>{{orderlist.order_amount_detail[1]}}</span>
			<span :class="{'payjin':weikuanjin}" @click="orderpay()">立即付尾款<br /><span>开始支付时间 {{fa_btime1}}</span></span>
		</div>
		<div class="orderxq-top">
			<img src="../../img-order/banner1@2x.png" v-if="orstatus==40"/>
			<img src="../../img-order/banner2@2x.png" v-if="orstatus==0"/>
			<img src="../../img-order/banner3@2x.png" v-if="orstatus==11"/>
			<img src="../../img-order/banner4@2x.png" v-if="orstatus==20"/>
			<img src="../../img-order/banner5@2x.png" v-if="orstatus==30"/>
		</div>
		<div class="order-address">
			<h3>{{useraddress.consignee}}<span v-text="useraddress.phone_mob==''?useraddress.phone_tel:useraddress.phone_mob"></span></h3>
			<p><img src="../../img-shopping/icon_adress@3x.png" class="dizhi" /><span v-text="useraddress.region_name+' '+useraddress.address"></span></p>
		</div>
		<div class="order-wuliu order-wuliu-xinxi1" v-if="orderlist.status>=30">
			<router-link :to="{path:'/myorder/ntlogistics',query:{'ordertoken':orderid,'logis':orderlist.invoice_no}}">
				<img src="../../img-order/icon_kuaidi@3x.png"/>
				<img src="../../img-order/icon_next@3x.png"/>
				<div class="order-wuliu-xinxi" v-if="logistics">
					<h4>{{logistics.expTextName}}<span>运单编号：{{logistics.mailNo}}</span></h4>
					<p>{{logistics.data[0].context}}</p>
					<span>{{logistics.data[0].time}}</span>
				</div>
				<div class="order-wuliu-xinxi" v-else>
					<h4>物流单号：{{orderlist.invoice_no}}</h4>
					<p>请到物流官网查询物流信息</p>
				</div>
			</router-link>
		</div>
		<div class="shopcard-listBox">
			<h3 class="shopcard-title" @click="dptz"><i><img src="../../img-shopping/icon_dianpu@3x.png"/></i><span class="dpname">{{ message }}</span></h3>
			<ul class="shopcard-list-item-box">
				<li class="shopcard-list-item" v-for="item in goods_list">
					<div>
						<router-link :to="{path:'/shopXQ/'+item.goods_id}">
							<img :src="'http://www.ntyouxuan.com/'+item.goods_image"/>
							<div class="shopcard-list-item-xinxi">
								<h3>{{item.goods_name}}</h3>
								<p><span>{{item.specification}}</span></p>
								<div class="shopcard-item-num">
									<span>￥</span>
									<span>{{item.price_detail[0]}}.</span>
									<span>{{item.price_detail[1]}}</span>
									<p class="shopDd-itemnum">x{{item.quantity}}</p>
								</div>
							</div>
						</router-link>
					</div>
					<div class="order-btn-list" v-if="orderlist.status==40&&orderlist.evaluation_status||(orderlist.status>=20)">
						<router-link :to="{path:'/myorder/orderpj',query:{'ordertoken':item.order_id,'goodstoken':item.goods_id,'spectoken':item.spec_id}}" v-if="orderlist.status==40&&item.evaluation==0&&member_status==1">评价</router-link>
						<router-link :to="{path:'/myorder/orderpjxq',query:{'orderpjxqid':item.rec_id}}" v-if="orderlist.status==40&&1<=item.evaluation&&item.evaluation<=3&&member_status==1">已评价</router-link>
						<router-link :to="{path:'/myorder/orderpjxq',query:{'orderpjxqid':item.rec_id}}" v-if="orderlist.status==40&&1<=item.evaluation&&item.evaluation<=3&&member_status==2">查看评价</router-link>
						<router-link :to="{path:'/myorder/refund',query:{'ordertoken':item.order_id,'goodstoken':item.goods_id,'spectoken':item.spec_id}}" v-if="orderlist.status>=20&&!item.refund_status&&member_status==1">申请退款</router-link>
						<router-link :to="{path:'/myorder/refundxq',query:{'refundid':item.refund_id}}" v-if="item.refund_status&&item.refund_status=='CLOSED'">退款关闭</router-link>
						<router-link :to="{path:'/myorder/refundxq',query:{'refundid':item.refund_id}}" v-if="item.refund_status&&item.refund_status=='SUCCESS'">退款成功</router-link>
						<router-link :to="{path:'/myorder/refundxq',query:{'refundid':item.refund_id}}" v-if="item.refund_status&&!(item.refund_status=='SUCCESS')&&!(item.refund_status=='CLOSED')">退款中</router-link>
					</div>
				</li>	
			</ul>
			<div class="shopDd-liuyan"><span>买家留言：</span><input type="text" name="" id="" value=" " v-model="postscript" readonly="readonly"/></div>
			<div class="shopDd-list-heji">
				<span>共{{orderlist.amount_quantity}}件商品</span>
				<span>合计</span><span>￥</span><span>{{goods_amount_detail[0]}}.</span><span>{{goods_amount_detail[1]}}</span>
			</div>
		</div>
		<div class="shopDd-djbz" v-if="orderlist.advance_status!=0">
			<div class="shopDd-jd1">
				<h4>阶段1：定金￥{{orderlist.advance_amount}}，抵扣￥{{orderlist.advance_de_amount}} <span v-if="orderlist.ad_status<3"><img src="../../img-address/icon_select @3x.png"/></span></h4>
				<p v-if="orderlist.ad_status==3"><span v-show="!adagree" @click="adagree=!adagree"><img src="../../img-address/icon_dis@3x.png"/></span><span v-show="adagree" @click="adagree=!adagree"><img src="../../img-address/icon_select @3x.png"/></span>我已同意<a>《定金不退等预售协议》</a></p>
			</div>
			<div class="shopDd-jd2">
				<h4 :class="{'orderred':orderlist.advance_status==3}">阶段2：尾款￥{{orderlist.fa_amount}}<span v-if="orderlist.advance_status==3"><img src="../../img-address/icon_select @3x.png"/></span></h4>
				<p v-if="orderlist.advance_status!=3">尾款支付时间：{{fa_btime}}-{{fa_etime}}</p>
				<p v-if="orderlist.advance_status!=3">支付尾款后发货</p>
			</div>
			<div class="shopDd-djtel"><span>通知支付尾款的手机号</span><span>{{orderlist.notify_phone}}</span></div>
		</div>
		<!--<ul class="shopDd-youhui">
			<li><span>优惠券</span><p><span>无可用优惠券</span><img src="../../img-shopping/icon_next@3x.png"/></p></li>
			<li><span>红包</span><p><span>无可用红包</span><img src="../../img-shopping/icon_next@3x.png"/></p></li>
		</ul>-->
		<ul class="shopDd-zhangdan">
			<li>商品<span>￥{{orderlist.goods_amount}}</span></li>
			<li>运费<span>+￥{{useraddress.shipping_fee}}</span></li>
			<li>店铺优惠<span>-￥{{orderlist.discount}}</span></li>
			<li>平台红包<span>-￥{{orderlist.packe}}</span></li>
			<li class="zhandan-footer" v-if="orderlist.status>=20">实付金额<span>￥{{orderlist.order_amount}}</span></li>
		</ul>
		<ul class="order-xinxi">
			<li>订单编号：{{orderlist.order_sn}}</li>
			<li>创建时间：{{add_time}}</li>
			<li v-if="orderlist.status>=20">付款时间：{{pay_time}}</li>
			<li v-if="fa_time!=''">发货时间：{{fa_time}}</li>
			<li v-if="over_time!=''">完成时间：{{over_time}}</li>
		</ul>
	</div>
</template>

<script>
	import orderxqcss from '@/css/orderxq.css'
	
	var furl = 'http://www.ntyouxuan.com/';
	export default{
		name:"roderxq",
		data(){
			return{
				adagree:true,
				user:0,
				orderid:0,
				orstatus:"",
				useraddress:'',
				orderlist:'',
				postscript:'',
				goods_list:'',
				add_time:'',
				pay_time:'',
				fa_time:'',
				over_time:'',
				fa_btime:'',
				fa_btime1:'',
				fa_etime:'',
				weikuanjin:false,
				logistics:'',
				goods_amount_detail:'',
				order_amount_detail:'',
				member_status:'',
				last_goodid:'',
				message: 'Hello Vue.js!'
			}
		},
		created:function(){
			var self=this;
			this.user=localStorage.getItem("nt_user");
			this.orderid=this.$route.query.orderid;
			console.log(this.user);
		},
		mounted:function(){
			var self=this;
			$.ajax({
				type:'post',
				url:furl+'index.php?app=ajax_buyer_order&act=view',
				data:{'token':self.user,'order_id':self.orderid},
				dataType:'json',
				success:function(res){
					if (res.done == false) {
						window.location.href = 'http://www.ntyouxuan.com/newnt/#/login';
					};
					self.dptzlj=res.retval.order.seller_id

					self.message = res.retval.order.seller_name
					
					self.member_status=res.retval.order.member_status;
					self.last_goodid=res.retval.order.last_goods_id;
					self.useraddress=res.retval.order_extm;
					self.orderlist=res.retval.order;
					self.orstatus=res.retval.order.status;
					self.postscript=res.retval.order.postscript;
					self.goods_list=res.retval.order.goods_list;
					self.goods_amount_detail=res.retval.order.goods_amount_detail;
					if(res.retval.order.ad_status=='1'){
						self.weikuanjin=true;
					}
					self.add_time=new Date(Number(res.retval.order.add_time)*1000).Format("yyyy-MM-dd hh:mm:ss");
					if(res.retval.order.pay_time){
						self.pay_time=new Date(Number(res.retval.order.pay_time)*1000).Format("yyyy-MM-dd hh:mm:ss");
					}
					if(res.retval.order.fa_btime){
						self.fa_btime=new Date(Number(res.retval.order.fa_btime)*1000).Format("MM月dd日 hh:mm:ss");
						self.fa_btime1=new Date(Number(res.retval.order.fa_btime)*1000).Format("MM.dd hh:mm:ss");
					}
					if(res.retval.order.fa_etime){
						self.fa_etime=new Date(Number(res.retval.order.fa_etime)*1000).Format("MM月dd日 hh:mm:ss");
					}
					if(res.retval.order.ship_time){
						self.fa_time=new Date(Number(res.retval.order.ship_time)*1000).Format("yyyy-MM-dd hh:mm:ss");
					}
					console.log(typeof(res.retval.order.finished_time));
					if(!(res.retval.order.finished_time=='0')){
						self.over_time=new Date(Number(res.retval.order.finished_time)*1000).Format("yyyy-MM-dd hh:mm:ss");
						console.log(self.over_time);
					}
//					if(res.retval.logistics&&res.retval.logistics!='null'){
//						if(res.retval.logistics.showapi_res_code!=-1){
//							self.logistics=res.retval.logistics.showapi_res_body;
//						}
//						
//					}
					$.ajax({
						type:"post",
						url:furl+"index.php?app=ajax_buyer_order&act=logt",
						data:{'invoice_no':res.retval.order.invoice_no,'token':self.user,'order_id':self.orderid},
						dataType:'json',
						success:function(data){
							if(data.done&&data.retval){
								self.logistics=data.retval;
							}
							
						}
					});
				}
			})
		},
		methods:{
			orderpay:function(){
				if(this.orderlist.ad_status=='1'){
					
				}else{
					this.$router.push({path:'/payrequet',query:{'ordertoken':this.orderid,'token':this.user}})
				}
			},
			dptz:function(){
				window.location.href='http://www.ntyouxuan.com/newnt/#/business/shopindex?store='+this.dptzlj;
			}
		}
	}
</script>

<style>
	.order-btn-list{
		height:0.68rem;
		text-align: right;
	}
	.order-btn-list>a{
		display: inline-block;
		line-height: 0.48rem;
		height:0.5rem;
		border-radius:0.5rem;
		padding-left: 0.24rem;
		padding-right: 0.24rem;
		font-size:0.24rem;
		color:#EE4846;
		min-width: 1.4rem;
		text-align: center;
		box-sizing: border-box;
		border:1px solid #EE4846;
		margin-left: 0.2rem;
	}
	.payjin{
		background-color:#F4857A !important;
	}
	.order-wuliu>a{display: block;height: 100%;}
	.orderred{color:#EE4846 !important;}
	.order-wuliu-xinxi1{min-height:1.41rem;}
	.order-address .dizhi{
		width: 14px;
		height: 22px;
	}
</style>